﻿<script type="text/javascript">
    $(document).ready(function () {
        $("#fr-sendquickreply").submit(function () {
            App.blockUI($("#ModalQuickReply"));
        });
        tinymce.init({
            selector: "textarea#@ViewBag.ticketid",
            height: 200,
        });
    });

    function templatetypechange(typeid) {
        App.blockUI($(".modal-body"));
        $.ajax({
            url: "/ticket/gettemplate?typeid=" + typeid,
            success: function (data) {
                $("#TemplateID").html("");
                $.each(data, function (id, option) {
                    $("#TemplateID").append($('<option></option>').val(option.id).html(option.name));
                });
                $.ajax({
                    url: "/ticket/gettemplatedetail?templateid=" + $("#TemplateID").val(),
                    success: function (data) {
                        $(".templatedetail").html(data);
                        tinymce.init({
                            selector: "textarea#" + $("#TemplateID").val(),
                            height: 200,
                        });
                        App.unblockUI($(".modal-body"));
                    }
                });
            }
        });
    }

    function templatechange(templateid) {
        App.blockUI($(".modal-body"));
        $.ajax({
            url: "/ticket/gettemplatedetail?templateid=" + templateid,
            success: function (data) {
                $(".templatedetail").html(data);
                tinymce.init({
                    selector: "textarea#" + templateid,
                    height: 200,
                });
                App.unblockUI($(".modal-body"));
            }
        });
    }
</script>
<form action="/ticket/sendquickreply" class="margin0" id="fr-sendquickreply">
    <input type="hidden" name="ticketid" value="@ViewBag.ticketid"/>
    <input type="hidden" name="to" value="@ViewBag.to"/>
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h4>Quick Reply</h4>
    </div>
    <div class="modal-body">
        <div class="row-fluid">
            <div class="span3">Template Type</div>
            <div class="span9">
                @Html.DropDownList("TemplateTypeID", null, "--- Select ---", new { @onchange = "templatetypechange(this.value)" })
            </div>
        </div>
        <div class="row-fluid">
            <div class="span3">Select Template</div>
            <div class="span9">
                <select id="TemplateID" onchange="templatechange(this.value)">
                    <option>--- Select ---</option>
                </select>
            </div>
        </div>
        <div class="templatedetail">
            <textarea id="@ViewBag.ticketid" name="Detail"></textarea>
        </div>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" type="submit">Send email</button>
        <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</form>
